<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>jQuery UI Tabs - Default functionality</title>
        <link rel="stylesheet" href="themes/ui-lightness/jquery.ui.all.css">
        <link type="text/css" href="apycommenus/menu.css" rel="stylesheet" />
        <link rel="stylesheet" href="bannerrotator/bannerrotator.css">
        <link rel="stylesheet" href="jquerydatatable/jquery.dataTables.css">
        <link rel="stylesheet" href="mycss/common.css">
        <script src="jquery-1.7.1.js"></script>
        <script src="ui/jquery.ui.core.js"></script>
        <script src="ui/jquery.ui.widget.js"></script>
        <script src="ui/jquery.ui.tabs.js"></script>
        <script src="ui/jquery.ui.mouse.js"></script>
        <script src="ui/jquery.ui.sortable.js"></script>
        <script type="text/javascript" src="apycommenus/menu.js"></script>
        <script type="text/javascript" src="bannerrotator/bannerrotator.js"></script>
        <script type="text/javascript" src="jquerydatatable/jquery.dataTables.js"></script>
        <script>
            $(function() {
                $( "#sortable" ).sortable({
                    placeholder: "ui-state-highlight"
                });
                $( "#sortable" ).disableSelection();
            });
        </script>

        <script>
            $(function() {
                $( "#tabs" ).tabs();
            });
        </script>
        <script>
        $(document).ready(function(){
            $("body div:last").remove();
        });
        </script>
        <script>
            function check(){
            	var acc = "admin";
            	var email = "admin@fsoft.com.vn";
            	if(document.getElementById("account").value!=acc){
            	alert("The username isn't existed!");	
            	return false;
            	}
            	if(document.getElementById("account").value==acc&&document.getElementById("email").value!=email){
            		alert("The username and email are not fit!");	
                	return false;
            	}
            	alert("The password is sent to your email!");
            	return true;
            }
        </script>
    </head>
    <body>
        <div id="container">
            <div id="header">
                <div class="rotator">
                    <ul>
                        <li class="show"><a href="#link1"><img src="bannerrotator/images/image-2.jpg" width="1012" height="200"  alt="pic1" /></a></li>
                        <li><a href="#link3"><img src="bannerrotator/images/image-3.jpg" width="1012" height="200"  alt="pic3" /></a></li>
                        <li><a href="#link4"><img src="bannerrotator/images/image-4.jpg" width="1012" height="200"  alt="pic4" /></a></li>
                        <li><a href="#link4"><img src="bannerrotator/images/image-5.jpg" width="1012" height="200"  alt="pic4" /></a></li>
                        <li><a href="#link4"><img src="bannerrotator/images/image-6.jpg" width="1012" height="200"  alt="pic4" /></a></li>
                    </ul>
                </div>
            </div>
            <div id="content">
                <div id="maincontent">
                    <div id="maincontentheader">
                        Recover password
                    </div>
                    <div id="tabs">
                        <div class="ui-tabs-panel">
                        <form action ="" method="post" onsubmit="return check()">
                        <b align="center">Please input your username and email to recover your password:</b>
                            <table align ="center">
                            	<tr>
                            		<td><b>Username: </b></td>
                            		<td><input type="text" id = "account" size = "30"</td>
                            	</tr>
                            	<tr>
                            		<td><b>Email: </b></td>
                            		<td><input type="text" id = "email" size = "30"</td>
                            	</tr>
                            	<tr>
                            		<td></td>
                            		<td align=><input type="submit" value = "Submit"/>
                            			<input type="button" value = "Cancel" onclick="location.href='Login.html'"/> </td>
                            	</tr>
                           	  </table>
                           	  </form>
                        </div>
                    </div>
                </div>
            </div>
            <div id="footer">
                <div style="width: 80%; margin:25px auto; text-align: center;
                     font-weight: bold; color: #F6AE38;">
                    Fresher 10 - mock project - bad team designed
                </div>
            </div>
        </div>
    </body>
</html>

